import React, {Component} from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    Animated,
    TouchableOpacity,
    Easing,
    View
} from 'react-native';


export default class Xian_load extends Component {

    constructor(props) {
        super(props);
        this.spinValue = new Animated.Value(0)
    }

    componentDidMount () {
        this.spin()
    }

    spin () {
        this.spinValue.setValue(0)
        Animated.timing(
            this.spinValue,
            {
                toValue: 1,
                duration: 1000,
                easing: Easing.linear
            }
        ).start(() => this.spin())
    }
    startAnimation() {
      this.state.rotateValue.setValue(0);
      Animated.timing(this.state.rotateValue, {
          toValue: 1,
          duration: 800,
          easing: Easing.linear
      }).start();
  }

    render() {

        const
        spin = this.spinValue.interpolate({
                inputRange: [0, 1],
                outputRange: ['0deg', '360deg']
            })


        return (
            <View style={styles.container}>
                <Animated.Image
                    style={{
                        width: 50,
                        height: 50,
                        transform: [{rotate: spin}] }}
                     source={require('../../img/app/logos.png')}
                />
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        alignItems:'center',

    },
});